﻿@model IEnumerable<ASC.Models.TreeNodeModel>
@{
    Layout = null;
}
@*<link href="@Url.Content("~/Content/tree/default/style.css")" rel="stylesheet" type="text/css" />*@

<script src="@Url.Content("~/Scripts/jquery.cookie.js")" type="text/javascript"></script>

<script src="@Url.Content("~/Scripts/tree/jquery.jstree.js")" type="text/javascript"></script>

<style>
    .jstree-default.jstree-focused
    {
    }
</style>

<script>

    function customMenu(node) {

        var items = {
            addNode: {
                // The item label
                "label": "Add",
                // The function to execute upon a click
                "action": function (obj) { nodeAction('add', obj) },
                // All below are optional 
                "_disabled": false, 	// clicking the item won't do a thing
                "_class": "class", // class is applied to the item LI node
                "separator_before": false, // Insert a separator before the item
                "separator_after": true, 	// Insert a separator after the item
                // false or string - if does not contain `/` - used as classname
                "icon": false
            },
            editNode: {
                // The item label
                "label": "Edit",
                // The function to execute upon a click
                "action": function (obj) { nodeAction('edit', obj) },
                // All below are optional 
                "_disabled": false, 	// clicking the item won't do a thing
                "_class": "class", // class is applied to the item LI node
                "separator_before": false, // Insert a separator before the item
                "separator_after": true, 	// Insert a separator after the item
                // false or string - if does not contain `/` - used as classname
                "icon": false
            },
            deleteNode: {
                "label": "Delete",
                "action": function (obj) { nodeAction('delete', obj) },
                "_class": "class",
                "separator_before": false,
                "separator_after": true,
                "icon": false
            },
            propertiesNode: {
                "label": "Properties",
                "action": function (obj) { nodeAction('properties', obj) },
                "_class": "class",
                "separator_before": false,
                "separator_after": true,
                "icon": false
            }
        };

        if ($(node).hasClass("root")) {
            delete items.editNode;
            delete items.deleteNode;
            delete items.propertiesNode;
        } else {
            delete items.addNode;
        }

        return items;
    }

    $(function () {
        $("#tree").jstree({
            "plugins": ["cookies", "themes", "html_data", "ui", "contextmenu","types"],
            contextmenu: { items: customMenu },
            "types": {
                "types": {
                    "channel": {
                        "icon": {
                            "image": "@Url.Content("~/Scripts/tree/channel.jpg")"
                        }
                    },
                    "module": {
                        "icon": {
                            "image": "@Url.Content("~/Scripts/tree/module.gif")"
                        }
                    },
                }
            }


        });
    });

</script>

<div id="tree">
    <ul>
        <li id="channels" class="root channel" rel="channel"><a href="#">Channels</a>
            <ul>
                @foreach (var ch in Model.Where(x => x.Type == (int)ASC.Models.TreeNodeType.Channel))
                {
                    <li id="ch_@(ch.Id)" value="@ch.Id" class="@ch.CssClass" rel="channel"><a href="#" title="@ch.Description" onclick="window.location = '@Url.Action("Edit", "Channel", new { Id = ch.Id })'">@ch.Name</a>
                    </li>
                }
            </ul>
        </li>
        <li id="modules" class="root module" rel="module"><a href="#">Modules</a>
            <ul>
                @foreach (var m in Model.Where(x => x.Type == (int)ASC.Models.TreeNodeType.Module))
                {
                    <li id="m_@(m.Id)" value="@m.Id" class="@m.CssClass" rel="module"><a href="#" title="@m.Description"  onclick="window.location = '@Url.Action("Edit", "Module", new { Id = m.Id })'">@m.Name</a>
                        <ul>
                            @if (m.ChildChannels != null)
                            {
                                foreach (var child in m.ChildChannels)
                                {
                                <li id="child_@(child.Id)" value="@child.Id" class="@child.CssClass" rel="channel"><a href="#" title="@child.Description" onclick="window.location = '@Url.Action("Edit", "Channel", new { Id = child.Id })'">@child.Name</a>
                                </li>
                                }
                            }
                        </ul>
                    </li>
                }
            </ul>
        </li>
    </ul>
</div>
